/* eslint-disable react-refresh/only-export-components */
import { memo } from "react";
import Container from "./container";
import { useWhyDidYouUpdate } from "ahooks";

function Test() {
  const container = Container.useContainer();
  useWhyDidYouUpdate("useWhyDidYouUpdateComponent", container);
  return (
    <div>
      {container.count}
      <button
        onClick={() => {
          container.setName(() => {
            return "早上好";
          });
        }}
      >
        变更名称
      </button>
    </div>
  );
}

export default memo(() => {
  return (
    <Container.Provider>
      <Test />
    </Container.Provider>
  );
});
